import React, { Component } from 'react';

import * as actionCreate from '../store/actions/index'

import {MOD_COUNT,MOD_AGE} from '../store/types/index'

//在需要使用redux组件中导入一个由react-redux提供的hoc
import {connect} from "react-redux"
class Counter extends Component {
    // constructor(props){
    //     super(props)
    //     // this.state = store.getState()

    //     //        //订阅数据更新
    //     // store.subscribe(() =>{
    //     //      this.setState(() => store.getState())
    //     // })
    // }
    
    render() {
        return (
            <div>
                <div>count:{this.props.tool.count}</div>
                <button onClick={this.props.handleClick.bind()}>点我+9</button>
                <div>age:{this.props.user.age}</div>
                <button onClick={this.props.handleAdd.bind()}>点我+1</button>
            </div>
        );
    }
    // handleClick = () =>{
    //     return () =>{
    //         // store.dispatch(actionCreate.createAction(MOD_COUNT,9))
    //     }
        
    // }
    // handleAdd = () =>{
    //     return () =>{
    //         // store.dispatch(actionCreate.createAction(MOD_AGE,1))
    //     }
    // }
}
//第二步:在类外面定义两个映射方法
function mapStateToProps(state){
    return state;
}
//将dispath映射成自身组件的props
function mapDispatchToProps(dispatch){
    return {
        handleClick(){
            dispatch(actionCreate.createAction(MOD_COUNT,9))
        },
        handleAdd(){
            dispatch(actionCreate.createActionAsync(MOD_AGE,1))
        }
    }
}
//应用hoc
export default connect(mapStateToProps,mapDispatchToProps)(Counter);
